<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <CustomTable
      ref="table"
      rowKey="id"
      :showColSettings="false"
      :hideColSettings="['action']"
      :showAlert="false"
      :showSelection="false"
      :showPagination="false"
      :loading="loading"
      :columns="columns"
      :dataSource="pageData"
      @change="onTableChange"
    >
      <template slot="order" slot-scope="text, record, index">
        {{ index + 1 }}
      </template>
    </CustomTable>
  </j-modal>
</template>

<script>
import CustomTable from '@/components/zxd/Table/CustomTable'
import * as api from '@/api/wxSmuggle/eventModel.js'
export default {
  name: 'HandleModal',
  components: {
    CustomTable
  },
  data() {
    return {
      width: 500,
      visible: false,
      loading: false,
      columns: [
        {
          title: '序号',
          dataIndex: 'order',
          scopedSlots: { customRender: 'order' },
          align: 'center',
          width: 60
        },
        {
          title: '手机号',
          align: 'center',
          dataIndex: 'phone'
        }
      ],
      title: '',
      pageData: [],
      pageFilter: {
        pageNo: 1,
        pageSize: 10
      }
    }
  },
  created() {},
  methods: {
    show(str1, str2) {
      this.title = str1
      // this.pageFilter.id = id
      this.visible = true
      // this.refreshTable()
      this.pageData = []
      let arr = str2.split(',')
      arr.forEach(item => {
        this.pageData.push({
          phone: item
        })
      })
    },
    refreshTable() {
      this.loading = true
      api
        .getVirtualIdentityPage(this.pageFilter)
        .then(res => {
          if (res.success) {
            this.pageData = res.result
            this.loading = false
            this.idDisabled = false
          } else {
            this.$message.warning(res.message)
            this.loading = false
          }
        })
        .catch(e => {
          this.loading = false
          this.$message.warn('请求失败！')
        })
    },
    onTableChange(pagination, pageFilter, sorter) {
      let keyMap = { currentPage: 'pageNo' }
      let paginations = Object.keys(pagination).reduce((newData, key) => {
        let newKey = keyMap[key] || key
        newData[newKey] = pagination[key]
        return newData
      }, {})
      this.pageFilter = Object.assign({}, this.pageFilter, paginations)
      this.refreshTable()
    },

    handleOk() {
      this.visible = false
    },
    handleCancel() {
      this.visible = false
    }
  }
}
</script>
<style lang="less" scoped>
.fyb {
  /deep/.ant-col-sm-16 {
    margin-left: 12%;
  }
}
</style>
